<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 箭头语法只能改写 赋值式 
        // function test(){}
        // const test1 = function(){

        // }
        // 一、箭头语法的使用 

        // ES5 
        // let fn = function(a){
        //     console.log(a)
        // }
        // ES6
        // let fn = (a)=>{
        //     console.log(a);
        // }
        // fn(1);
        // 2. 箭头语法如果是一个参数 可以省略括号
        // let fn = a=>{
        //     console.log(a);
        // }
        // fn(1);
        // 3. 箭头 后面不写{} 会自动return  
        // let fn = function(){
        //     return 123;
        // }

        // let fn = ()=>123;
        // console.log(fn());

        // let fn = function(v){
        //     return v;
        // }

        // let fn = v=>v;
        // console.log(fn(2));


        // 二、箭头语法特性；
        // 1.箭头语法没有arguments
        // let fn = v=>{
        //     console.log(arguments);
        // }
        // fn();

        // 2.箭头语法 没有自己的this 他的this是外层（context）的this
        // let obj = {
        //     name:"张三",
        //     fn:function(){
        //         console.log(this);
        //     }
        // }
        // obj.fn();


        document.onclick = function(){
            console.log("第一个",this)
            setTimeout(()=>{
                console.log("第二个",this);
            }, 1000);
        }




    </script>
</body>
</html>